<?php

use backend\models\MallMaterial;
use backend\models\MallMaterialMenu;
use backend\models\MallPublisher;
use kartik\file\FileInput;
use yii\helpers\ArrayHelper;
use yii\helpers\Html;
use yii\helpers\Url;
use yii\widgets\ActiveForm;

/* @var $this yii\web\View */
/* @var $model backend\models\MallMaterial */
/* @var $form yii\widgets\ActiveForm */
?>

<div class="mall-material-form">

    <?php $form = ActiveForm::begin(['options' => ['enctype' => 'multipart/form-data']]); ?>

    <?= $form->field($model, 'pid')->dropDownList(
        ArrayHelper::map(MallMaterialMenu::find()->where(['status' => 1,'rank' => 1])->all(), 'id', 'title'),
        [
            'prompt' => '选择归类',
            'onchange' => '
                $.post("index.php?r=mall-material/lists&id='.'"+$(this).val(),function(data){
                $("select#mallmaterial-mid").html(data);
      });'
        ]
    ) ?>

    <?= $form->field($model, 'mid')->dropDownList(
        ArrayHelper::map(MallMaterialMenu::find()->where(['status' => 1,'rank' => 2])->all(), 'id', 'title'),
        ['prompt' => '选择归类']
    ) ?>

    <?= $form->field($model, 'publisher_id')->dropDownList(
        ArrayHelper::map(MallPublisher::find()->where(['status' => 1])->all(), 'id', 'name'),
        ['prompt' => '选择发布者']
    ) ?>

    <?= $form->field($model, 'title')->textInput(['maxlength' => true]) ?>

    <?= $form->field($model, 'style')->dropDownList(MallMaterial::attributeValue()['style']) ?>

    <?= $emoji->emoji ?>

    <?= $form->field($model, 'words')->textarea(['rows' => 10]) ?>

    <?php
    $pluginOptions = [
        // 需要预览的文件格式
        'previewFileType' => 'image',
        // 预览的文件
//            'initialPreview' => ['图片1', '图片2', '图片3'],
        // 需要展示的图片设置，比如图片的宽度等
//            'initialPreviewConfig' => ['width' => '120px'],
        // 是否展示预览图
        'initialPreviewAsData' => true,
        // 异步上传的接口地址设置
        'uploadUrl' => Url::toRoute(['upload/material-img']),
        // 异步上传需要携带的其他参数，比如商品id等
        'uploadExtraData' => [
//            'goods_id' => '111',
        ],
        'uploadAsync' => true,
        // 最少上传的文件个数限制
        'minFileCount' => 1,
        // 最多上传的文件个数限制
        'maxFileCount' => 10,
        // 是否显示移除按钮，指input上面的移除按钮，非具体图片上的移除按钮
        'showRemove' => true,
        // 是否显示上传按钮，指input上面的上传按钮，非具体图片上的上传按钮
        'showUpload' => true,
        //是否显示[选择]按钮,指input上面的[选择]按钮,非具体图片上的上传按钮
        'showBrowse' => true,
        // 展示图片区域是否可点击选择多文件
        'browseOnZoneClick' => true,
        // 如果要设置具体图片上的移除、上传和展示按钮，需要设置该选项
        'fileActionSettings' => [
            // 设置具体图片的查看属性为false,默认为true
            'showZoom' => false,
            // 设置具体图片的上传属性为true,默认为true
            'showUpload' => true,
            // 设置具体图片的移除属性为true,默认为true
            'showRemove' => true,
        ],
        'allowedFileExtensions' => ['jpg', 'jpeg', 'png'],
    ];
    if ($model->img_url) {
        // 切割图片后展示
        $allImages = explode(',', $model->img_url);
        $pluginOptions['initialPreview'] = $allImages; // 做成数组放在此处
    }
    echo $form->field($model, 'file')->label('图片')->widget(FileInput::class, [
        'options' => ['multiple' => true],
        'pluginOptions' => $pluginOptions,
        // 一些事件行为
        'pluginEvents' => [
            // 上传成功后的回调方法，需要的可查看data后再做具体操作，一般不需要设置
            "fileuploaded" => "function (event, data, id, index) {
                //判断是否是空字符串 是 直接放进去 不是-追加进入
                var prefix = $.trim($('#mallmaterial-img_url').val());
                if (prefix == 0) {
                    $('#mallmaterial-img_url').val(data['response']['message']);
                } else {
                    $('#mallmaterial-img_url').val($('#mallmaterial-img_url').val() + ',' + data['response']['message'])
                }
                console.log(data);
            }",
        ],
    ]);
    ?>

    <?= $form->field($model, 'img_url')->textarea(['rows' => 6]) ?>

    <?php
    //视频上传开始
    $pluginOptionsVideo = [
        // 需要预览的文件格式
        'initialPreviewFileType' => 'video',
        'previewFileType' => 'video',

        // 预览的文件
//            'initialPreview' => ['图片1', '图片2', '图片3'],
        // 需要展示的图片设置，比如图片的宽度等
//            'initialPreviewConfig' => ['width' => '120px'],
        // 是否展示预览图
        'initialPreviewAsData' => true,
        // 异步上传的接口地址设置
        'uploadUrl' => Url::toRoute(['upload/material-video']),
        // 异步上传需要携带的其他参数，比如商品id等
        'uploadExtraData' => [
//            'goods_id' => '111',
        ],
        'uploadAsync' => true,
        // 最少上传的文件个数限制
        'minFileCount' => 1,
        // 最多上传的文件个数限制
        'maxFileCount' => 10,
        // 是否显示移除按钮，指input上面的移除按钮，非具体图片上的移除按钮
        'showRemove' => true,
        // 是否显示上传按钮，指input上面的上传按钮，非具体图片上的上传按钮
        'showUpload' => true,
        //是否显示[选择]按钮,指input上面的[选择]按钮,非具体图片上的上传按钮
        'showBrowse' => true,
        // 展示图片区域是否可点击选择多文件
        'browseOnZoneClick' => true,
        // 如果要设置具体图片上的移除、上传和展示按钮，需要设置该选项
        'fileActionSettings' => [
            // 设置具体图片的查看属性为false,默认为true
            'showZoom' => false,
            // 设置具体图片的上传属性为true,默认为true
            'showUpload' => true,
            // 设置具体图片的移除属性为true,默认为true
            'showRemove' => true,
        ],

        'allowedFileExtensions' => [ "mp4", "3gp"],
    ];

    if ($model->video_url) {
        $pluginOptionsVideo['initialPreview'] = $model->video_url;
    }
    echo $form->field($model, 'file_video')->label('视频素材(mp4格式)')->widget(FileInput::class, [
        'options' => ['multiple' => true],
        'pluginOptions' => $pluginOptionsVideo,
        // 一些事件行为
        'pluginEvents' => [
            // 上传成功后的回调方法，需要的可查看data后再做具体操作，一般不需要设置
            "fileuploaded" => "function (event, data, id, index) {
                $('#mallmaterial-video_url').val(data['response']['message']);
                console.log(data);
        }",
        ],
    ]);
    //视频上传结束
    ?>

    <?= $form->field($model, 'video_url')->textarea(['rows' => 6]) ?>

    <?= $form->field($model, 'down_count')->textInput(['value' => 0]) ?>

    <?= $form->field($model, 'sort')->textInput(['value' => 100]) ?>

    <!--    --><? //= $form->field($model, 'update_time')->textInput() ?>

    <!--    --><? //= $form->field($model, 'create_time')->textInput() ?>

    <?= $form->field($model, 'status')->dropDownList(MallMaterial::attributeValue()['status']) ?>

    <div class="form-group">
        <?= Html::submitButton('保存', ['class' => 'btn btn-success']) ?>
    </div>

    <?php ActiveForm::end(); ?>

</div>

<?php
$js = <<< JS
    // $('source').attr("type","video/mp4");
    $('.field-mallmaterial-file_video').find('source').attr('type','video/mp4');
JS;
$this->registerJs($js)
?>